<!DOCTYPE html>
<html>

<head>
	@include("/include/_header.html", {'title':'选择角色'}){}

	<link rel="stylesheet" href="${ctxPath}/bootstrap/css/bootstrap.min.css" media="all">
	<link rel="stylesheet" href="${ctxPath}/treeview/css/bootstrap-treeview.min.css" media="all">
	<script src="${ctxPath}/jquery/js/jquery.min.js"></script>
	<script src="${ctxPath}/treeview/js/bootstrap-treeview.min.js"></script>
	<style>
		.list-group-item {
			cursor: pointer;
		}

		.node-selected {
			color: #FFFFFF;
			background-color: #428bca;
		}
	</style>
</head>

<body>
	<div class="layui-fluid">
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md12">
				<ul class="list-group">
					@for(tWmsMaterialType in tWmsMaterialTypes){
					<li class="list-group-item ">
						${tWmsMaterialType.name}
					</li>
					@}
				</ul>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		var currIndex = -1;
		var tWmsMaterialTypes = ${tWmsMaterialTypes};
		$(function(){
			$(".list-group-item").click(function () {
				if ($(this).hasClass("node-selected")) {
					currIndex = -1;
					$(this).removeClass("node-selected");
				} else {
					currIndex = $(this).index();
					$(".list-group-item").removeClass("node-selected");
					$(this).addClass("node-selected");
				}
			});
		})
		layui.config({
			base: '${ctxPath}' + '/layuiadmin/' //静态资源所在路径
		}).extend({
			index: 'lib/index' //主入口模块
		}).use('index', function () {
			var $ = layui.$;
			window.getValue = function () {
				console.log(tWmsMaterialTypes);
				if (currIndex == -1) {
					layer.alert("请选择相关物料类型");
					return;
				}
				return tWmsMaterialTypes[currIndex];
			}
		});

	</script>
</body>

</html>